<template>
  <el-dialog custom-class="turn-down-staff-reim" v-el-drag-dialog="{ drag: true, full: false, resize: false }"
    :close-on-click-modal="false" :visible="true" @close="closeMd" width="32%" title="报账驳回" append-to-body>
    <el-form :model="fm.ps" :ref="fm.fname" label-width="100px">
      <el-form-item label="拒绝原因" prop="reason" :rules="[{ required: true, message: '请输入拒绝原因', trigger: 'blur' }]">
        <el-input v-model="fm.ps.reason" type="textarea" :rows="4" resize="none" />
      </el-form-item>
    </el-form>

    <div class="fm-btn-row">
      <el-button :loading="fm.sb.load" style="margin-left: 20px" type="primary" icon="el-icon-success" @click="onSubmit">
        确 定
      </el-button>
    </div>
  </el-dialog>
</template>

<script>
import elDragDialog from "@/directive/el-drag-dialog";
import * as orderSer from "@/api/services/order.service";

export default {
  name: "TurnDownStaffReim",
  directives: { elDragDialog },
  props: { myData: Object },
  data() {
    return {
      fm: {
        fname: 'turnDownStaffReimFm',
        sb: { load: false },
        ps: {
          // 审核记录id,多条审核逗号拼接
          ids: '',
          // 审核后通知人uname，多个通知逗号拼接，可为空
          reason: '',
        }
      }
    };
  },
  created() {
    // 设置-审核记录id数组字符串
    this.fm.ps.ids = this.myData.list.map(it => it.id).join(',');
  },
  methods: {
    closeMd() {
      this.$emit("myClick", { state: false });
    },

    // 表单-提交
    onSubmit() {
      const that = this, U = that.U, fm = that.fm, ps = U.scopy(fm.ps);

      that.$refs[fm.fname].validate(valid => {
        if (!valid) { return false; } else {
          orderSer.checkRefuse(ps).then(res => {
            if (res.code !== 1) {
              U.qerror(res.msg);
            } else {
              U.qsuccess(res.msg);

              that.closeMd();
              that.$emit("reloadDg");
            }
          });
        }
      });
    }
  },
};
</script>
